// JavaScript Document
$(document).ready(function(e) {
	(function() {
		$(".detail-sort-box").hover(function(e) {
			$(this).find(".detail-sort-show").css({
				"visibility": "visible"
			});
			$(this).find(".detail-sort").addClass("hover-detail-sort");
		}, function() {
			$(this).find(".detail-sort-show").css({
				"visibility": "hidden"
			});
			$(this).find(".detail-sort").removeClass("hover-detail-sort");
		});
	})();
	(function() {
		$(".sort-title-detail").click(function(e) {
			$(".sort-title-detail").removeClass("active");
			$(this).addClass("active");
			var href = $(".active").data("href");
			href = "#" + href;
			$(".recommend-box ul").css({
				"visibility": "hidden"
			});
			$(href).css({
				"visibility": "visible"
			});
		});
	})();
	(function() {
		var h = $(".banner").height();
		var length = $(".slide img").length;
		var i = 1;
		var height;
		var rightH;

		function rightPartMove() {
			var h = 55;
			i = i % length;
			rightH = i * h;
			$(".index-active").animate({
				top: rightH
			});
		}

		function leftPartMove() {
			i = i % length;
			height = i * h;
			console.log(i);
			$(".slide").animate({
				top: -height
			});
			i++;
		}

		function clickIndex() {
			if ($(".slide").is(":animated")) {
				return;
			}
			$(".index-item").click(function() {
				i = $(this).index() - 1;
			});
		}
		function animate()  {
				rightPartMove();
				leftPartMove();
			}

		function init() {
			setInterval(animate, 2000);
			clickIndex();
		}
		init();
	})();
	(function() {
		$(".swiper").on("mouseenter mouseleave", '.swiper_block', function(e) {
			var w = $(this).width();
			var h = $(this).height();
			var x = (e.pageX - this.offsetLeft - (w / 2)) * (w > h ? (h / w) : 1);
			var y = (e.pageY - this.offsetTop - (h / 2)) * (h > w ? (w / h) : 1);
			var direction = Math.round((((Math.atan2(y, x) * (180 / Math.PI)) + 180) / 90) + 3) % 4;
			var eventType = e.type;
			var dirName = new Array(1, 2, 3, 4); //上右下左
			if (e.type == 'mouseenter') {
				switch (dirName[direction]) {
				case 1:
					{
						$(this).find("div").css({
							top: "-100%",
							left: "0%"
						});
						$(this).find("div").animate({
							top: "0%",
							left: "0%"
						});
					};
					break;
				case 3:
					{
						$(this).find("div").css({
							top: "100%",
							left: "0%"
						});
						$(this).find("div").animate({
							top: "0%",
							left: "0%"
						});
					};
					break;
				case 2:
					{
						$(this).find("div").css({
							left: "100%",
							top: "0%"
						});
						$(this).find("div").animate({
							left: "0%",
							top: "0%"
						});
					};
					break;
				case 4:
					{
						$(this).find("div").css({
							left: "-100%",
							top: "0%"
						});
						$(this).find("div").animate({
							left: "0%",
							top: "0%"
						});
					};
					break;
				}
			} else if (e.type == 'mouseleave') {
				switch (dirName[direction]) {
				case 1:
					{
						$(this).find("div").animate({
							top: "-100%",
							left: "0%"
						});
					};
					break;
				case 3:
					{
						$(this).find("div").animate({
							top: "100%",
							left: "0%"
						});
					};
					break;
				case 2:
					{
						$(this).find("div").animate({
							left: "100%",
							top: "0%"
						});
					};
					break;
				case 4:
					{
						$(this).find("div").animate({
							left: "-100%",
							top: "0%"
						});
					};
					break;
				}
			}
		});
	})();
});